<!--友情链接-->
<template>
  <div class="friendly_box">
    <Title title="友情链接" />
    <div class="tag_group">
      <template v-for="(item, index) in tags">
        <el-tag class="tag" :key="index" :type="randomClr()" size="small">
          {{ item }}
        </el-tag>
      </template>
    </div>
  </div>
</template>
<script>
import Title from "@/components/zTitle/pugIndex";
export default {
  components: {
    Title,
  },
  data() {
    return {
      tags: ["美国", "英国", "日本", "印度"],
    };
  },
  methods: {
    randomClr() {
      const types = ["success", "warning", "danger", "info", "default"];
      const str = types[Math.floor(Math.random() * 5)];
      return str;
    },
  },
};
</script>
<style lang="scss" scoped>
.friendly_box {
  background-color: #fff;
  margin-top: 12px;
  .tag_group {
    padding: 10px 10px;
    .tag {
      margin: 5px;
      cursor: default;
      letter-spacing: 1px;
      font-size: 14px;
    }
  }
}
</style>